<template>
  <el-table
    :data="tableData"
    border
    style="width: 100%"
    :span-method="arraySpanMethod"
  >
    <el-table-column
      label="名称"
      width="180"
    ><template v-slot="scope">
      <span style="font-weight: bold;">{{ scope.row.name }}</span>
    </template>
    </el-table-column>
    <el-table-column
      label="内容"
    ><template v-slot="scope">
      <span style="font-weight: bold;">{{ scope.row.desc }}</span>
    </template>
    </el-table-column>
    <el-table-column
      label="A"
      width="180"
    >
      <template v-slot="scope">
        <span style="font-weight: bold;"><el-input v-model="scope.row.A" size="small" placeholder="请输入内容" /></span>
      </template>
    </el-table-column>
    <el-table-column
      label="B"
      width="180"
    >
      <template v-slot="scope">
        <span style="font-weight: bold;"><el-input v-model="scope.row.B" size="small" placeholder="请输入内容" /></span>
      </template>
    </el-table-column>
    <el-table-column
      label="C"
      width="180"
    >
      <template v-slot="scope">
        <span style="font-weight: bold;"><el-input v-model="scope.row.C" size="small" placeholder="请输入内容" /></span>
      </template>
    </el-table-column>
  </el-table>
</template>
<script>
/**
 * @Date: 2022/4/4
 */

export default {
  name: 'Question9',
  model: {
    prop: 'modelValue',
    event: 'change'
  },
  props: {
    modelValue: {
      type: Object,
      default: () => {}
    }
  },
  data() {
    return {
      startWatchFlag: false,
      tableData: [{
        name: '机械特性调试',
        desc: '磨合后合闸位置',
        A: '',
        B: '',
        C: ''
      }, {
        desc: '磨合后自由位置',
        A: '',
        B: '',
        C: ''
      }, {
        desc: '磨合后手测超程',
        A: '',
        B: '',
        C: ''
      }, {
        desc: '调节后合闸位置',
        A: '',
        B: '',
        C: ''
      }, {
        desc: '调节后手测超程',
        A: '',
        B: '',
        C: ''
      }]
    }
  },
  watch: {
    tableData: {
      async handler(newVal, oldVal) {
        if (!this.startWatchFlag) return
        const rt = {}
        let i = 1
        let chaochengflag = false
        let shuziflag = false
        if (this.$data.tableData[0].A && this.$data.tableData[1].A) {
          const A = (this.$data.tableData[0].A - this.$data.tableData[1].A).toFixed(2)
          if (isNaN(A)) {
            shuziflag = true
          } else {
            if (A < 0) {
              chaochengflag = true
              this.startWatchFlag = false
              this.$nextTick(() => {
                this.$data.tableData[2].A = A
                this.$nextTick(() => {
                  this.startWatchFlag = true
                })
              })
            } else {
              this.$data.tableData[2].A = A.toString()
            }
          }
        } else {
          this.$data.tableData[2].A = ''
        }
        if (this.$data.tableData[0].B && this.$data.tableData[1].B) {
          const B = (this.$data.tableData[0].B - this.$data.tableData[1].B).toFixed(2)
          if (isNaN(B)) {
            shuziflag = true
          } else {
            if (B < 0) {
              chaochengflag = true
              this.startWatchFlag = false
              this.$nextTick(() => {
                this.$data.tableData[2].B = B
                this.$nextTick(() => {
                  this.startWatchFlag = true
                })
              })
            } else {
              this.$data.tableData[2].B = B.toString()
            }
          }
        } else {
          this.$data.tableData[2].B = ''
        }
        if (this.$data.tableData[0].C && this.$data.tableData[1].C) {
          const C = (this.$data.tableData[0].C - this.$data.tableData[1].C).toFixed(2)
          if (isNaN(C)) {
            shuziflag = true
          } else {
            if (C < 0) {
              chaochengflag = true
              this.startWatchFlag = false
              this.$nextTick(() => {
                this.$data.tableData[2].C = C
                this.$nextTick(() => {
                  this.startWatchFlag = true
                })
              })
            } else {
              this.$data.tableData[2].C = C.toString()
            }
          }
        } else {
          this.$data.tableData[2].C = ''
        }
        //
        if (this.$data.tableData[3].A && this.$data.tableData[1].A) {
          const A = (this.$data.tableData[3].A - this.$data.tableData[1].A).toFixed(2)
          if (isNaN(A)) {
            shuziflag = true
          } else {
            if (A < 0) {
              chaochengflag = true
              this.startWatchFlag = false
              this.$nextTick(() => {
                this.$data.tableData[4].A = A
                this.$nextTick(() => {
                  this.startWatchFlag = true
                })
              })
            } else {
              this.$data.tableData[4].A = A.toString()
            }
          }
        } else {
          this.$data.tableData[4].A = ''
        }
        if (this.$data.tableData[3].B && this.$data.tableData[1].B) {
          const B = (this.$data.tableData[3].B - this.$data.tableData[1].B).toFixed(2)
          if (isNaN(B)) {
            shuziflag = true
          } else {
            if (B < 0) {
              chaochengflag = true
              this.startWatchFlag = false
              this.$nextTick(() => {
                this.$data.tableData[4].B = B
                this.$nextTick(() => {
                  this.startWatchFlag = true
                })
              })
            } else {
              this.$data.tableData[4].B = B.toString()
            }
          }
        } else {
          this.$data.tableData[4].B = ''
        }
        if (this.$data.tableData[3].C && this.$data.tableData[1].C) {
          const C = (this.$data.tableData[3].C - this.$data.tableData[1].C).toFixed(2)
          if (isNaN(C)) {
            shuziflag = true
          } else {
            if (C < 0) {
              chaochengflag = true
              this.startWatchFlag = false
              this.$nextTick(() => {
                this.$data.tableData[4].C = C
                this.$nextTick(() => {
                  this.startWatchFlag = true
                })
              })
            } else {
              this.$data.tableData[4].C = C.toString()
            }
          }
        } else {
          this.$data.tableData[4].C = ''
        }
        if (chaochengflag) {
          await this.$message.error('磨合后超程为负数，请检查')
        }
        if (shuziflag) {
          await this.$message.error('请输入数字')
        }
        newVal.forEach((item) => {
          rt[`input${i}_1`] = item.A
          rt[`input${i}_2`] = item.B
          rt[`input${i}_3`] = item.C
          i++
        })
        let flag = false
        for (const key in rt) {
          if (rt[key] === '') {
            flag = true
            break
          }
        }
        if (flag) {
          rt.fe = '未填写完整'
        } else {
          rt.fe = ''
        }
        this.$emit('change', rt)
      },
      deep: true
    }
  },
  created() {
    if (Object.keys(this.modelValue).length === 0) {
      this.$emit('change', { 'input1_1': '', 'input1_2': '', 'input1_3': '', 'input2_1': '', 'input2_2': '', 'input2_3': '', 'input3_1': '', 'input3_2': '', 'input3_3': '', 'input4_1': '', 'input4_2': '', 'input4_3': '', 'input5_1': '', 'input5_2': '', 'input5_3': '' })
    } else {
      let i = 1
      this.tableData.forEach((item) => {
        item.A = this.modelValue[`input${i}_1`]
        item.B = this.modelValue[`input${i}_2`]
        item.C = this.modelValue[`input${i}_3`]
        i++
      })
    }
    this.startWatchFlag = true
  },
  methods: {
    arraySpanMethod({ row, column, rowIndex, columnIndex }) {
      if (columnIndex === 0) {
        if (rowIndex === 0) {
          return [6, 1]
        } else {
          return [0, 0]
        }
      }
    }
  }
}
</script>

<style scoped>

</style>
